<template>
	<view>
		<div v-if="qbsj.length>0" class="bm">
			<div class="lm" v-for="(item,index) in qbsj" :key="index">
				<div style="display: flex;">
					<div style="flex: 1; display: flex; align-items: center;">
						<img :src="item.user.avatar" alt="image"
							style="width: 30px;height: 30px;border-radius: 100%;">
						<div style="font-size: 14px; font-weight: bold;margin-left: 10px;">{{item.user.nickname}}
						</div>
					</div>
					<div style="flex: 1; display: flex; justify-content: flex-end;align-items: center;">
						<div style="margin-right: 10px;">
							<van-icon name="ellipsis" size="20px" @click="onSelect"/>
						</div>
					</div>
				</div>
					
				<div style="font-size: 16px; color: #7a7a7a;margin: 10px 0;">
					{{item.content}}
				</div>
					
				<div style="display: flex; border: 1px solid #f0f0f0;">
					<div
						style="width: 50px; height: 50px; border-right: 1px solid #f0f0f0; display: flex; justify-content: center; align-items: center;">
						<span style="color: #808080; font-size: 14px;">{{item.riqi}}</span>
					</div>
					<div style="flex: 1; display:flex; flex-direction: column; justify-content:center;">
						<div style="font-size:15px;font-weight:bold;color:#808080;margin-left:20px;">
							{{item.title}}
						</div>
						<div style="font-size:12px;color:#808080;margin-left:20px;">{{item.provenance}}</div>
					</div>
				</div>
					
				<div style="display: flex;margin: 20px;">
					<div style="flex: 1; display: flex;font-size: 12px;color: #b0b0b0;">
						<van-icon name="chat-o" style="margin-right: 10px;" />
						<van-icon name="like-o" style="margin-right: 10px;" :color="axzt" @click="djax" />
						<div>21</div>
					</div>
					<div
						style="flex: 1;box-sizing: border-box;padding-right: 10px;display: flex;justify-content: flex-end;">
						<van-icon name="share-o" size="20px" />
					</div>
					<!-- <div style="flex: 1;font-size: 12px;color: #b0b0b0;">
						{{item.nq}}
					</div> -->
					
				</div>
				<div style="margin: 10px 0;font-size: 14px;color: #a6a6a6;" @click="scsj(item)">删除</div>
				
			</div>
					
		</div>
		<van-empty v-else description="暂无喜欢..." />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				qbsj:[],
			};
		},
		methods:{
			scsj(item) {
			  //获取本地数组
			  let myArray = uni.getStorageSync('myArray')
			  //用filter方法过滤掉跟item一样的元素
			  let newArray = myArray.filter(function(element) {
			    return element.id != item.id
			  })
			  //保存新的数组到本地
			  uni.setStorageSync('myArray', newArray)
			  //更新data中的数组
			  this.qbsj = newArray
			}
		},
		mounted() {
			this.qbsj = uni.getStorageSync('myArray')
			console.log(uni.getStorageSync('myArray'));
		}
	}
</script>

<style lang="less">
.bm {
		box-sizing: border-box;
		padding: 15px;
		width: 100%;
		height: 80%;

		.lm {
			margin: 10px 0;
			height: 100%;
			width: 100%;
			background-color: white;
			border-radius: 10px;
			position: relative;
			z-index: 100;
			box-sizing: border-box;
			padding: 10px;
			overflow: auto;

		}
	}

</style>
